<template>
  <div class="page-container">
    <ShowList 
      :title="title" 
      :columns="columns" 
      :tableData="tableData" 
      :operation="operation"
      :total="total"
      :pageNum="queryParams.pageNum"
      :pageSize="queryParams.pageSize"
      @page-change="handlePageChange"
      @refresh="handleRefresh"
      @delete="handleDelete"
    />
  </div>
</template>

<script setup>
import ShowList from '@/components/ncpsy/ZSPT/Page123Vue/ShowList.vue';
import { ref, onMounted } from 'vue'
import {listArea, delArea} from '@/api/ncpsy/management/area'
import { ElMessage, ElMessageBox } from 'element-plus'
import useUserStore from '@/store/modules/user'

const title = ref('种植地信息管理')
const columns = ref([
  { prop: 'areaName', label: '区域名称', width: '200px', align: 'center' },
  { prop: 'areaAddress', label: '区域地址', width: '300px', align: 'center' },
  { prop: 'areaAcreage', label: '区域面积', width: '150px', align: 'center' },
  { prop: 'landKind', label: '土地类型', width: '150px', align: 'center' },
  { prop: 'areaStatus', label: '产地状态', width: '150px', align: 'center' }
])
const operation = ref([
  { label: '完善信息', action: 'completeInfo', type: 'primary' },
  { label: '所种作物', action: 'crop', type: 'success' }
])
const tableData = ref([])
const total = ref(0)
const userStore = useUserStore()

// 查询参数
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  userId: userStore.id
})

// 获取种植地数据
const getAreaList = async () => {
  try {
    console.log('获取种植地数据参数:', queryParams.value)
    const response = await listArea(queryParams.value)
    if (response && response.code === 200) {
      tableData.value = response.rows
      total.value = response.total
    }
  } catch (error) {
    console.error('获取种植地数据失败:', error)
  }
}

// 处理分页变化
const handlePageChange = (page) => {
  queryParams.value.pageNum = page
  getAreaList()
}

// 处理删除
const handleDelete = async ({ index, row }) => {
  try {
    await ElMessageBox.confirm(
      '确定要删除该种植地信息吗？',
      '删除确认',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }
    )
    
    await delArea(row.areaId)
    ElMessage.success('删除成功')
    getAreaList() // 重新加载数据
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error('删除失败：' + (error.message || '未知错误'))
    }
  }
}

// 处理刷新
const handleRefresh = () => {
  queryParams.value.pageNum = 1
  getAreaList()
}

onMounted(() => {
  getAreaList()
})
</script>


<style scoped>
.page-container {
  padding: 20px;
  background-color: #f5f7fa;
  min-height: calc(100vh - 84px);
}
</style>